import { Input } from "antd"
import React from "react"

const { Search } = Input

interface SearchBarProps {
  query: string
  setQuery: (q: string) => void
  onSearch: () => void
}

const SearchBar: React.FC<SearchBarProps> = ({ query, setQuery, onSearch }) => (
  <Search
    placeholder="input search text"
    allowClear
    enterButton="Search"
    size="large"
    value={query}
    onChange={(e) => setQuery(e.target.value)}
    onSearch={onSearch}
    style={{ width: 300 }}
  />
)

export default SearchBar
